<%@page contentType="text/html"%>  
<%@page pageEncoding="UTF-8"%>

<%@taglib prefix="f" uri="http://java.sun.com/jsf/core"%>
<%@taglib prefix="h" uri="http://java.sun.com/jsf/html"%>  
<%@taglib uri="http://richfaces.org/a4j" prefix="a4j"%>  
<%@taglib uri="http://richfaces.org/rich" prefix="rich"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@taglib uri="http://myfaces.apache.org/tomahawk" prefix="t"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"   
"http://www.w3.org/TR/html4/loose.dtd">  
<html>
    <head>
        <title>Compra</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <meta http-equiv="Pragma" content="no-cache">
        <meta http-equiv="cache-control" content="no-cache">
        <meta http-equiv="cache-control" content="no-store">
        <meta http-equiv="expires" content="0">

        <script type="text/javascript" src="../_js/dFilter.js"></script>
        <script type="text/javascript" src="../_js/valores.js"></script>
    </head>
    <style type="text/css"><!--@import url("../_css/style.css");--></style>
    <style type="text/css">
        .panelModal {
            vertical-align:top;
            width:600px;
            height:470px;
        }
        A:hover { color: red  }
    </style>
    <body>
        <f:view>
            <t:saveState id="_bean" value="#{CompraBean}" />
            <rich:panel>
                <f:facet name="header">
                    <h:outputText value="Compra"/>
                </f:facet>
                <h:form>

                    <h:inputHidden value="#{CompraBean.id}" id="id"/>

                    <t:panelGrid columns="4" id="pnlCompra">
                            <t:column width="15%">
                                <h:outputLabel value="Nota Fiscal *" for="notaFiscal"/>
                            </t:column>
                            <t:column width="35%">
                                <h:inputText value="#{CompraBean.notaFiscal}" id="notaFiscal" style="width:50px;text-align:center;" onkeypress="return SomenteNumero(event);" maxlength="8"/>
                            </t:column>
                            <t:column width="15%">&nbsp;</t:column>
                            <t:column width="35%">&nbsp;</t:column>

                            <t:column width="15%">
                                <h:outputLabel value="Fornecedor *" for="fornecedorId"/>
                            </t:column>
                            <t:column width="35%">
                                <h:selectOneMenu id="fornecedorId" value="#{CompraBean.fornecedorId}" style="width:250px;">
                                    <f:selectItem itemValue="" itemLabel=""/>
                                    <f:selectItems value="#{CompraBean.listaFornecedores}"/>
                                </h:selectOneMenu>
                            </t:column>
                            <t:column width="15%">&nbsp;</t:column>
                            <t:column width="35%">&nbsp;</t:column>
                    </t:panelGrid>

                    <rich:panel style="width:800px">
                        <f:facet name="header"><h:outputText value="Itens (Produtos)"/></f:facet>
                        <t:panelGrid columns="4" id="pnlCompraItem">
                            <t:column width="15%">
                                <h:outputLabel value="Produto *" for="produtoId"/>
                            </t:column>
                            <t:column width="35%">
                                <h:inputText value="#{CompraBean.produtoId}" id="produtoId" style="width:50px;text-align:center;" onkeypress="return SomenteNumero(event);" maxlength="8">
                                    <a4j:support event="onblur" ajaxSingle="true" action="#{CompraBean.buscarProduto}" reRender="pnlCompraItem"/>
                                </h:inputText>&nbsp;
                                <h:inputText value="#{CompraBean.produtoDescricao}" id="produtoDescricao" style="width:250px;" readonly="true" onclick="Richfaces.showModalPanel('modalProduto')"/>
                                <a4j:commandButton image="../_images/btn_pesquisar.png" title="Pesquisar" immediate="true" ajaxSingle="true" onclick="Richfaces.showModalPanel('modalProduto')"/>
                            </t:column>
                            <t:column width="15%"><rich:message for="produtoId" style="color:red;"/></t:column>
                            <t:column width="35%">&nbsp;</t:column>

                            <t:column width="15%"><h:outputLabel value="Quantidade *" for="produtoQuantidade"/></t:column>
                            <t:column width="15%">
                                <h:inputText value="#{CompraBean.produtoQuantidade}" id="produtoQuantidade" label="Quantidade" maxlength="12" onkeypress="return SomenteNumero(event);" required="true" requiredMessage="Campo Requerido." style="width:80px;text-align:right">
                                    <a4j:support event="onblur" ajaxSingle="true" action="#{CompraBean.calculaTotal}" reRender="pnlCompraItem"/>
                                </h:inputText>
                            </t:column>
                            <t:column width="15%"><rich:message for="produtoQuantidade" style="color:red;"/></t:column>
                            <t:column width="35%">
                                <h:outputText value="Tamanho:"/>
                                <h:outputText value="#{CompraBean.produtoTamanho}" id="produtoTamanho"/>&nbsp;&nbsp;
                            </t:column>

                            <t:column width="15%"><h:outputLabel value="Valor Unitário *" for="produtoValorUnitario"/></t:column>
                            <t:column width="15%">
                                <h:inputText value="#{CompraBean.produtoValorUnitario}" id="produtoValorUnitario" label="Valor Unit" readonly="true" style="width:80px;text-align:right">
                                    <f:convertNumber pattern="#,##0.00"></f:convertNumber>
                                    <a4j:support event="onblur" ajaxSingle="true" action="#{CompraBean.calculaTotal}" reRender="pnlCompraItem"/>
                                </h:inputText>
                            </t:column>
                            <t:column width="15%"><rich:message for="produtoValorUnitario" style="color:red;"/></t:column>
                            <t:column width="35%">
                                <h:outputText value="Marca:"/>
                                <h:inputHidden value="#{CompraBean.marcaId}" id="marcaId"/>
                                <h:outputText value="#{CompraBean.marcaDescricao}" id="marcaDescricao"/>
                            </t:column>

                            <t:column width="15%"><h:outputLabel value="Valor Desconto" for="produtoValorDesconto"/></t:column>
                            <t:column width="15%">
                                <h:inputText value="#{CompraBean.produtoValorDesconto}" id="produtoValorDesconto" label="Valor Desconto" maxlength="12" onkeypress="reais(this,event,13)" onkeydown="backspace(this,event)" required="true" requiredMessage="Campo Requerido." style="width:80px;text-align:right">
                                    <f:convertNumber pattern="#,##0.00"></f:convertNumber>
                                    <a4j:support event="onblur" ajaxSingle="true" action="#{CompraBean.calculaTotal}" reRender="pnlCompraItem"/>
                                </h:inputText>
                            </t:column>
                            <t:column width="15%"><rich:message for="produtoValorDesconto" style="color:red;"/></t:column>
                            <t:column width="35%">&nbsp;</t:column>

                            <t:column width="15%"><h:outputLabel value="Valor Total" for="produtoValorTotal"/></t:column>
                            <t:column width="15%">
                                <h:inputText value="#{CompraBean.produtoValorTotal}" id="produtoValorTotal" label="Valor Total" readonly="true" style="width:80px;text-align:right">
                                    <f:convertNumber pattern="#,##0.00"></f:convertNumber>
                                </h:inputText>
                            </t:column>
                            <t:column width="15%"><rich:message for="produtoValorTotal" style="color:red;"/></t:column>
                            <t:column width="35%">&nbsp;</t:column>

                            <t:column width="15%"><a4j:commandButton value="Incluir" action="#{CompraBean.incluirItem}" ajaxSingle="true" reRender="tblCompraItem,pnlCompraItem,tblCompraLancamentos,valor"/>&nbsp;&nbsp;</t:column>
                            <t:column width="15%"></t:column>
                            <t:column width="15%">&nbsp;</t:column>
                            <t:column width="35%">&nbsp;</t:column>
                        </t:panelGrid>

                        <rich:dataTable id="tblCompraItem" value="#{CompraBean.listaCompraItems}" var="vit" width="700px" columns="2" rowKeyVar="rowKey">
                            <rich:column width="30px" style="text-align:center;">
                                <f:facet name="header"><h:outputText value="Cód"/></f:facet>
                                <h:inputHidden value="#{vit.id}"/>
                                <h:outputText value="#{vit.produto.id}"/>
                            </rich:column>
                            <rich:column>
                                <f:facet name="header"><h:outputText value="Marca"/></f:facet>
                                <h:outputText value="#{vit.produto.marca.descricao}"/>
                            </rich:column>
                            <rich:column>
                                <f:facet name="header"><h:outputText value="Descrição"/></f:facet>
                                <h:outputText value="#{vit.produto.descricao}"/>
                            </rich:column>
                            <rich:column width="40px" style="text-align:center;">
                                <f:facet name="header"><h:outputText value="Tamanho"/></f:facet>
                                <h:outputText value="#{vit.produto.tamanho}"/>
                            </rich:column>
                            <rich:column width="40px" style="text-align:right;">
                                <f:facet name="header"><h:outputText value="Quantidade"/></f:facet>
                                <h:outputText value="#{vit.quantidade}"><f:convertNumber pattern="#,##0.00"/></h:outputText>
                            </rich:column>
                            <rich:column width="40px" style="text-align:right;">
                                <f:facet name="header"><h:outputText value="Valor Unit"/></f:facet>
                                <h:outputText value="#{vit.valorUnitario}"><f:convertNumber pattern="#,##0.00"/></h:outputText>
                            </rich:column>
                            <rich:column width="40px" style="text-align:right;">
                                <f:facet name="header"><h:outputText value="Valor Desc"/></f:facet>
                                <h:outputText value="#{vit.valorDesconto}"><f:convertNumber pattern="#,##0.00"/></h:outputText>

                                <f:facet name="footer">
                                    <h:outputLabel value="Total"/>
                                </f:facet>
                            </rich:column>
                            <rich:column width="40px" style="text-align:right;">
                                <f:facet name="header"><h:outputText value="Valor Total"/></f:facet>
                                <h:outputText value="#{vit.valorTotal}"><f:convertNumber pattern="#,##0.00"/></h:outputText>

                                <f:facet name="footer">
                                    <h:outputLabel value="#{CompraBean.totalItems}">
                                        <f:convertNumber pattern="#,##0.00"></f:convertNumber>
                                    </h:outputLabel>
                                </f:facet>
                            </rich:column>
                            <rich:column width="30px" style="text-align:center;">
                                <f:facet name="header">
                                    <h:outputText value="Ações"/>
                                </f:facet>
                                <a4j:commandButton value="#{rowKey}" image="../_images/btn_excluir.gif" binding="#{CompraBean.btnExcluirItem}" immediate="true"
                                    reRender="tblCompraItem,tblCompraLancamentos,valor" action="#{CompraBean.excluirItem}" ajaxSingle="true"/>
                            </rich:column>
                        </rich:dataTable>
                    </rich:panel>

                    <br>
                    <rich:panel style="width:800px">
                        <f:facet name="header"><h:outputText value="Pagamento"/></f:facet>
                        <h:panelGrid columns="3">

                            <h:inputHidden id="valor" value="#{CompraBean.valor}"/>

                            <h:outputLabel value="Forma de Pagamento Padrão" for="formaPagamentoId"/>
                            <h:selectOneMenu id="formaPagamentoId" value="#{CompraBean.formaPagamentoId}" style="width:250px;">
                                <f:selectItem itemValue="" itemLabel=""/>
                                <f:selectItems value="#{CompraBean.listaFormaPagamentos}"/>
                                <a4j:support event="onchange" ajaxSingle="true" action="#{CompraBean.actionReplicaFormaPagamento}" reRender="tblCompraLancamentos,valor"/>
                            </h:selectOneMenu>
                            <rich:message for="formaPagamentoId" style="color:red;"/>

                            <h:outputLabel value="Num Parcelas *" for="qtdParcelas"/>
                            <h:inputText value="#{CompraBean.qtdParcelas}" id="qtdParcelas" required="true" style="width:40px;text-align:center;" onkeypress="return SomenteNumero(event);" requiredMessage="Campo Requerido.">
                                <a4j:support event="onblur" ajaxSingle="true" action="#{CompraBean.actionCarregaLancamentos}" reRender="tblCompraLancamentos,valor"/>
                            </h:inputText>
                            <rich:message for="qtdParcelas" style="color:red;"/>

                        </h:panelGrid>

                        <rich:dataTable id="tblCompraLancamentos" value="#{CompraBean.listaCompraLancamentos}" var="vla" width="130px" columns="2" rowKeyVar="rowKey">

                            <rich:column width="30px" style="text-align:center;">
                                <f:facet name="header"><h:outputText value="Num"/></f:facet>
                                <h:outputText value="#{vla.numParcela}"/>
                            </rich:column>
                            <rich:column width="40px" style="text-align:right;">
                                <f:facet name="header"><h:outputText value="Forma de Pagamento"/></f:facet>
                                <h:selectOneMenu value="#{vla.formaPagamento.id}" style="width:200px;">
                                    <f:selectItem itemValue="" itemLabel=""/>
                                    <f:selectItems value="#{CompraBean.listaFormaPagamentos}"/>
                                </h:selectOneMenu>
                            </rich:column>
                            <rich:column width="40px" style="text-align:right;">
                                <f:facet name="header"><h:outputText value="Data Vencimento"/></f:facet>
                                <h:inputHidden value="#{vla.id}"/>
                                <rich:calendar id="dataVencimento" popup="true" datePattern="dd/MM/yyyy" inputSize="7" enableManualInput="false" value="#{vla.dataVencimento}" required="true" requiredMessage="Campo Requerido."/>
                                <rich:message for="dataVencimento" style="color:red;"/>
                            </rich:column>
                            <rich:column width="40px" style="text-align:right;">
                                <f:facet name="header"><h:outputText value="Valor"/></f:facet>
                                <h:inputText value="#{vla.valor}" label="Valor Parcela" maxlength="12" onkeypress="reais(this,event,13)" onkeydown="backspace(this,event)" style="width:80px;text-align:right">
                                    <f:convertNumber pattern="#,##0.00"></f:convertNumber>
                                </h:inputText>
                            </rich:column>
                        </rich:dataTable>
                    </rich:panel>
                    <h:outputText id="mensagemErros" value="#{CompraBean.mensagemErros}" escape="false" styleClass="erro"/>
                    <br>
                    <a4j:commandButton value="Salvar" action="#{CompraBean.salvar}" reRender="pnlCompra,pnlCompraItem,tblCompraLancamentos,mensagemErros" ignoreDupResponses="false"/>&nbsp;&nbsp
                    <a4j:commandButton value="Retornar" action="#{CompraBean.retornar}" immediate="true"/>&nbsp;&nbsp;
                </h:form>
            </rich:panel>

            <rich:modalPanel id="modalProduto" zindex="19999" left="20px" top="20px" autosized="true">
                <a4j:form id="frmProdutoProduto">
                    <rich:panel styleClass="panelModal">
                        <f:facet name="header">
                            <h:outputText value="Produto" />
                        </f:facet>
                        <center>
                            <h:outputLabel value="Descrição"/>&nbsp;&nbsp;
                            <h:inputText value="#{CompraBean.produtoDescricaoPesq}" id="produtoDescricaoPesq" style="width:150px;"/>&nbsp;&nbsp;
                            <a4j:commandButton value="Pesquisar" onclick="Richfaces.showModalPanel('modalProduto')" action="#{CompraBean.pesquisarProduto}" reRender="frmProdutoProduto"/>&nbsp;&nbsp;
                            <h:commandButton value="Fechar" onclick="Richfaces.hideModalPanel('modalProduto')"/>
                        </center>
                        <br>
                        <rich:dataTable id="tblProduto" value="#{CompraBean.listaProdutos}" width="100%" var="pro"
                            columns="6" rows="13" rowKeyVar="rowKey" reRender="ds">
                            <rich:column width="40px" sortBy="#{pro.id}">
                                <f:facet name="header"><h:outputText value="Cód"/></f:facet>
                                <h:outputText value="#{pro.id}"/>
                            </rich:column>
                            <rich:column sortBy="#{pro.marca.descricao}">
                                <f:facet name="header"><h:outputText value="Marca"/></f:facet>
                                <h:outputText value="#{pro.marca.descricao}"/>
                            </rich:column>
                            <rich:column sortBy="#{pro.descricao}">
                                <f:facet name="header"><h:outputText value="Descrição"/></f:facet>
                                <h:outputText value="#{pro.descricao}"/>
                            </rich:column>
                            <rich:column sortBy="#{pro.tamanho}">
                                <f:facet name="header"><h:outputText value="Tamanho"/></f:facet>
                                <h:outputText value="#{pro.tamanho}"/>
                            </rich:column>
                            <rich:column sortBy="#{pro.valorCompra}">
                                <f:facet name="header"><h:outputText value="Valor"/></f:facet>
                                <h:outputText value="#{pro.valorCompra}"><f:convertNumber pattern="#,##0.00"/></h:outputText>
                            </rich:column>
                            <rich:column width="20px">
                                <f:facet name="header"><h:outputText value="Sel"/></f:facet>
                                <a4j:commandButton image="../_images/btn_selecionar.gif" binding="#{CompraBean.btnSelecionarProduto}" title="Selecionar" value="#{pro.id}" ajaxSingle="true" action="#{CompraBean.selecionarProduto}" onclick="Richfaces.hideModalPanel('modalProduto')" reRender="pnlCompraItem"/>
                            </rich:column>

                            <f:facet name="footer">
                                <rich:datascroller id="ds"></rich:datascroller>
                            </f:facet>
                        </rich:dataTable>
                    </rich:panel>
                </a4j:form>
            </rich:modalPanel>

            <a4j:status id="modalStatus" onstart="Richfaces.showModalPanel('ajaxLoadingModalBox')"
            onstop="Richfaces.hideModalPanel('ajaxLoadingModalBox')" />
            <rich:modalPanel id="ajaxLoadingModalBox" zindex="20000" autosized="true">
                <h:outputText value="Carregando"/><br>
                <h:graphicImage value="../_images/img_load.gif"/>
            </rich:modalPanel>
        </f:view>
    </body>
</html>